
import React from 'react';
import { FileOutlined, FolderOpenOutlined } from "@ant-design/icons";
import Controller, { IFileItem } from "Controller";
import { List } from "antd";
import styles from './index.module.less';
import Location from "../Location";
import GoIn from './ui/GoIn';
import AddGlb from './ui/AddGlb';

export default function FileList() {

    const currentFileList = Controller.instance.useMemo(s => s.project.currentFileList, [])

    return (
        <List
            bordered
            header={<Location />}
            className={styles.list}
            dataSource={currentFileList}
            renderItem={(item, index) => (
                <List.Item actions={[<ListActions item={item} />]} >
                    <List.Item.Meta
                        className={styles.meta}
                        avatar={item.isFile ? <FileOutlined /> : <FolderOpenOutlined />}
                        description={<div title={item.name} >{item.name}</div>}
                    />
                </List.Item>
            )}
        />
    )
}

function ListActions(props: { item: IFileItem }) {

    const { item } = props;

    if (item.isFile) {
        switch (item.extension) {
            case 'glb':
                return <AddGlb record={item} />;
        }
        return <></>;
    } else {
        return <GoIn record={item} />;
    }
}